<template>
	<view class="CashCheck">
		<view class="CashCheckRed"></view>
		<view class="CashCheckRedJB">
			<image src="../../static/jb.png" style="width: 27rpx;height: 27rpx;" mode=""></image>
			<text style="margin-left: 10rpx;">我的金币</text>
			<text style="font-size: 38rpx;margin-left: 4rpx;">{{MonthGold}}</text>
			<text style="float: right;">签到规则</text>
		</view>
		<view class="CashCheckEnvelopes">
			<view style="padding: 0 40rpx;box-sizing: border-box;overflow-y: auto;padding-bottom: 50rpx;">
				<view style="width: 1180rpx;overflow-y: auto;">
					<view style="width: 45rpx;margin-right: 40rpx;display: inline-block;" v-for="(item,index) in signList">
						<view class="CashRedEnvelopes" style="position: relative;">
							<image v-if="index < count" src="../../static/hbqd.png" style="width: 100%;height: 100%;position: absolute;top: 0;z-index: 1;" mode=""></image>
							<view style="position: absolute;bottom: 10rpx;z-index: 2;">
								+{{item}}
							</view>
						</view>
						<view style="font-size: 22rpx;font-family: PingFang SC;font-weight: 500;color: #888888;width: 66rpx;">{{index + 1}}天</view>
					</view>
				</view>
			</view>
			<view class="ContinuityDay">
				已连续签到{{signinfoList.count}}天
			</view>
		</view>
		<view class="SmallChange" @click="CashCheckClick(1)">
			<text class="SmallChangeText">0元</text> 
		</view>
		<view class="CashCheckBottom">
			<view style="padding: 0 34rpx;box-sizing: border-box;padding-bottom: 27rpx;">做任务,领金币</view>
			<view class="CashCheckBottomTask" v-for="(item,index) in taskList">
				<view>{{item.name}}</view>
				<view>金币<text style="color: #FF4236;">+{{item.gold}}</text></view>
				<view class="Reward" v-if="item.completed == 1 && item.reward == 0" @click="WelfareSign(item.type,item.gold,item.value)">领奖励</view>
				<view v-if="item.completed == 0" @click="CashCheckClick(item.link)" class="Reward" style="background: #FFFFFF;border: 2rpx solid #DFAE7C;color: #FFDFB891;
						box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.16);color: #DFBA94;">去完成</view>
				<view class="Reward" v-if="item.completed == 1 && item.reward == 1" @click="WelfareSign(item.type,item.gold,item.value)" style="background: #F8F8F8;color: #888888;">已领取</view>		
			</view>
		</view>
	</view>
</template>

<script>
	import {VUE_API_URL,VUE_API_URL_IMG} from "@/components/pulugins/index"
	export default {
		data() {
			return {
				menu:[],
				list:[],
				webitInfo:{},
				falseData:[],
				signList:[],
				signInfo:{},
				RuleSF:false,		//活动规则弹窗
				count:0,
				mygold:'',
				MonthGold:0,
				authentication:'',
				authentica1:0,
				authentica2:0,
				authentica3:0,
				taskList:'',
				signinfoList:'',
			}
		},
		onLoad() {
			var that = this
			that.init();
			that.getUserInfor();
			that.SigninfoFun();
		},
		methods: {
			SigninfoFun(){
				var that = this
				uni.request({
				    url: VUE_API_URL + 'welfare/signinfo', 
					method:'POST',
				    data: {
						
					}, 
				    header: {
				        'Authori-zation': 'Bearer ' + uni.getStorageSync('token') //自定义请求头信息
				    },
				    success: (res) => {
						that.taskList = res.data.data.taskList;
						that.signinfoList = res.data.data.signinfo;
				    }
				});
			},
			WelfareSign(type,gold,value){
				var that = this
				uni.request({
				    url: VUE_API_URL + '/welfare/sign', 
					method:'POST',
				    data: {
						type:value,
						gold:gold
					}, 
				    header: {
				        'Authori-zation': 'Bearer ' + uni.getStorageSync('token') //自定义请求头信息
				    },
				    success: (res) => {
						that.SigninfoFun();
						uni.showToast({
						    title: '领取完成',
							icon:'none',
						    duration: 2000
						});
				    }
				});
			},
			CashCheckClick(index){
				var that = this;
				if(index == 1){
					uni.navigateTo({
					    url: '../second/MySmallChange'
					});
				}else{
					// window.location = VUE_API_URL_IMG + '#' + index
					console.log(index)
					var urls = '..' + index
					console.log(urls)
					uni.navigateTo({
					    url: urls
					});
				}
			},
			init(){
				var that = this
				uni.request({
				    url: VUE_API_URL + 'welfare/index', 
					method:'POST',
				    data: {}, 
				    header: {
				        'Authori-zation': 'Bearer ' + uni.getStorageSync('token') //自定义请求头信息
				    },
				    success: (res) => {
						var data = res.data.data
						that.menu = data.menu;				//菜单
						that.list = data.activity;			//活动
						that.falseData = data.cashList		//假数据
						that.signList = data.signList 		//签到奖励
						that.signInfo = data.signinfo		//当前用户签到信息
						that.count = data.signinfo.count	//签到次数
						that.MonthGold = data.signinfo.month	//当月金币
				    }
				});
				uni.request({
				    url: VUE_API_URL + 'website', 
					method:'get',
				    data: {},
				    success: (res) => {
						that.webitInfo = res.data.data
				    }
				});
			},
			getUserInfor(){
				var that = this;
				uni.request({
				    url: VUE_API_URL + '/user/info', 
					method:'POST',
				    data: {}, 
				    header: {
				        'Authori-zation': 'Bearer ' + uni.getStorageSync('token') //自定义请求头信息
				    },
				    success: (res) => {
						that.mygold = res.data.data.gold;
						var authentica = res.data.data.authentication;
						var arr = authentica.split(',');
						console.log(arr)
						for(var i=0;i<arr.length;i++){
							if(arr[i]==1){
								that.authentica1 = 1
							}else if(arr[i]==2){
								that.authentica2 = 1
							}else if(arr[i]==3){
								that.authentica3 = 1
							}
						}
				    }
				});
			}
			
		}
	}
</script>

<style>
	::-webkit-scrollbar {
			width: 0;
			height: 0;
			background-color: transparent;
		} 
	.CashRedEnvelopes{
		width: 45rpx;
		height: 45rpx;
		/* background-image: url(../../static/hbqd.png); */
		background-size: 100% 100%;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #DFB993;
		background: #F2F2F2;
	}
	.Reward{
		width: 123rpx;
		height: 44rpx;
		background: linear-gradient(-84deg, #DFBA94, #DFAE7C);
		box-shadow: 1px 3rpx 10rpx 0px rgba(0, 0, 0, 0.16);
		border-radius: 22rpx;
		color: #FFF8F8;
		text-align: center;
		line-height: 44rpx;
		position: absolute;
		top: 35rpx;
		right: 35rpx;
	}
	.CashCheckBottomTask{
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #888888;
		padding: 25rpx 34rpx 0 34rpx;box-sizing: border-box;
		border-top: 1px solid #FFF8F8;
		position: relative;height: 113rpx;
	}
	.CashCheckBottom{font-size: 30rpx;font-family: PingFang SC;font-weight: bold;color: #000000;margin-top: 65rpx;}
	.SmallChangeText{position: absolute;bottom: 27rpx;left: 40rpx;font-size: 24rpx;font-family: PingFang SC;font-weight: 500;color: #000000;}
	.SmallChange{
		width: 680rpx;height: 123rpx;margin: auto;
		margin-top: 50rpx;
		background-image: url(../../static/day.png);
		background-size: 100% 100%;position: relative;
	}
	.ContinuityDay{
		height: 90rpx;
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #000000;
		padding: 0 56rpx;
		line-height: 90rpx;
		border-top: 1px solid #FFE4E4;
	}
	.CashCheckEnvelopesViewDay{
		width: 45rpx;
		display: inline-block;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #888888;
		margin-right: 40rpx;
	}
	.CashCheckEnvelopesViewImage{
		background-image: url(../../static/hbqd.png);
		background-size: 100% 100%;
		width: 45rpx;
		height: 46rpx;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #DFB994;
	}
	.CashCheckEnvelopesView{
		width: 588rpx;
		margin: auto;
		height: 200rpx;
		overflow-y: auto;
	}
	.CashCheckEnvelopes{
		width: 688rpx;
		height: 302rpx;
		background: #FFFFFF;
		box-shadow: 0px 0px 40rpx 1px rgba(0, 0, 0, 0.1);
		border-radius: 20rpx;
		margin: auto;
		padding-top: 70rpx;
		box-sizing: border-box;
	}
	.CashCheckRedJB{
		padding: 37rpx 62rpx 43rpx 40rpx;
		box-sizing: border-box;
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}
	.CashCheckRed{
		width: 100%;
		height: 240rpx;
		background: #FF4236;
		position: absolute;
		top: 0;
		z-index: -1;
	}
	.RollingRoll{
			width: 100%;
		}
		#app{color:#444444;font-family: PingFang SC;}
		.welfare-rule{padding-top:90rpx;font-size:28rpx;text-align:right;box-sizing: border-box;padding-right: 26rpx;background: #FFFFFF;}
		.welfare-content{box-sizing: border-box;padding:15rpx 38rpx 0 38rpx;background: #FFFFFF;}
		.max-title{font-size:45rpx;font-weight: bold;}
		CashCheckEnvelopes{margin-top: 48rpx;}
		.title-info{overflow: hidden;}
		.title-info .title-info-image{width:43rpx;height:34rpx}
		.title-info img,.title-info text{float:left;display: inline-block;}
		.title-info .title-info-title{font-size:32rpx;font-weight: bold;line-height:34rpx;margin-left:12rpx;}
		.title-info .title-info-info{font-size:24rpx;margin-top:7rpx;margin-left:31rpx}
		.CashCheckEnvelopes .collect-money-use{margin-top:37rpx;overflow: hidden;}
		.CashCheckEnvelopes .collect-money-use .collect-money-use-text{flaot:left;font-size:28rpx;color: #000000;line-height: 44rpx;display:inline-block;}
		.CashCheckEnvelopes .collect-money-use .collect-money-use-text text{color:#FF4236;padding:0 10rpx}
		.CashCheckEnvelopes .collect-money-use .collect-money-use-issign{background: linear-gradient(-84deg, #DFBA94, #DFAE7C);box-shadow: 1rpx 3rpx 10rpx 0rpx rgba(0, 0, 0, 0.16);border-radius: 22rpx;text-align: center;color:#FFFFFF;font-size:26rpx;line-height:35rpx;height:50rpx;width:152rpx;float:right}
		.CashCheckEnvelopes .sign-list{margin-top: 40rpx;padding: 0 40rpx;box-sizing: border-box;}
		.CashCheckEnvelopes .sign-list .sign-item{float:left;font-size:24rpx;text-align:center;width:50rpx !important;padding-right: 40rpx;}
		.CashCheckEnvelopes .sign-list .sign-item .sign-item-content{width:100%;height:47rpx;border-radius: 3rpx 3rpx 0rpx 0rpx;line-height: 47rpx;color:#DFB994;background-image: url(../../static/hbqd.png);background-size: 100% 100%;
	font-size: 24rpx;font-family: PingFang SC;font-weight: 500;color: #DFB994;}
		.CashCheckEnvelopes .sign-list .sign-item .sign-item-title{margin-top:20rpx;font-size: 20rpx;}
		.CashCheckEnvelopes .sign-list .sign-item:not(:first-child){margin-left:43rpx;}
		.CashCheckEnvelopes .sign-list .sign-item:not(:first-child){margin-left: 0 !important;}
		.sign-list{height: 120rpx;border-bottom: 1px solid #C0C0C0;}
		.uni-swiper-slide-frame{width: 60% !important;}
		/* uni-swiper .uni-swiper-wrapper{ !important;} */
</style>
